<?php 
/**
Template Page for the gallery carousel

Follow variables are useable :

	$gallery     : Contain all about the gallery
	$images      : Contain all images, path, title
	$pagination  : Contain the pagination content
	$current     : Contain the selected image
	$prev/$next  : Contain link to the next/previous gallery page
	

 You can check the content when you insert the tag <?php var_dump($variable) ?>
 If you would like to show the timestamp of the image ,you can use <?php echo $exif['created_timestamp'] ?>
**/
?>
<?php if (!defined ('ABSPATH')) die ('No direct access allowed'); ?><?php if (!empty ($gallery)) : ?>
<?php global $post;
	$layout_meta = '';
	$slide_pageNum = 5;
	if( $post ) { $layout_meta = get_post_meta( $post->ID, 'colormag_page_layout', true ); if($layout_meta=='no_sidebar_full_width'){$slide_pageNum=7;}
	} ?>
<div class="ngg-galleryoverview">

	<div class="pic"><img title="<?php echo esc_attr($current->description) ?>" alt="<?php echo esc_attr($current->alttext) ?>" src="<?php echo nextgen_esc_url($current->url); ?>" /></div>
	<div class="description">
		<span class="counter"><em><?php $num = 1;  foreach ($images as $image) {
			if($image->pid==$current->pid){
				echo $num;
				break;
			}
			$num++;
		} ?></em>/<?php echo count($images) ?></span>
		<div class="desc">
			<?php echo esc_attr($current->description) ?>
		</div>
	</div>
	<div class="ngg-gallery-list">
		<div class="ngg-gallery-wrapper">
		<ul class="ngg-thumbnail-list clearfix">
		<!-- Thumbnail list -->
		<?php for ($n=1,$i=0;$i<count($images);$i++){ $image = $images[$i];?>
			<?php if ( $image->hidden ) continue; ?> 
			<?php if($n%$slide_pageNum==1):?>
			<li>
			<?php endif;?>
				<a id="ngg-thumbnail-<?php echo $n-1 ?>" bx-index="<?php echo $n-1 ?>" class="<?php if ($image->pid == $current->pid) echo 'selected' ?>" href="<?php echo nextgen_esc_url($image->pidlink) ?>" title="<?php echo esc_attr($image->description) ?>" >
					<img title="<?php echo esc_attr($image->description) ?>" alt="<?php echo esc_attr($image->alttext) ?>" src="<?php echo nextgen_esc_url($image->thumbnailURL) ?>" <?php echo $image->size ?> />
				</a>
			 <?php if($n%$slide_pageNum==0){ echo "</li>";}$n++; ?> 

	 	<?php }?>
	 	</ul>
		</div>
	 	
	</div>
 	
</div>

<?php endif; ?>
<!-- 获取下一篇图集 -->
<?php $next_post = get_next_post(true);   
   if (!empty( $next_post )):?>
   <input type="hidden" id="nextpost_link" value="<?php echo get_permalink( $next_post->ID ); ?>">
<?php endif;?>
<script type="text/javascript">
	jQuery(function ($) {
		var selectedThumbnail = $('.ngg-thumbnail-list .selected')
			,cur_index = parseInt(selectedThumbnail.attr('bx-index'))
			,s = Math.floor(cur_index/<?php echo $slide_pageNum;?>)
			;

		var opt = {
			startSlide:s,
			pager:false,
			infiniteLoop:false,
			hideControlOnEnd:true,
			prevText:'&#9668;',
			nextText:'&#9658;',
			responsive:false
		}
		$('.ngg-thumbnail-list').bxSlider(opt);

	    $('.ngg-galleryoverview .pic').on('mousemove',function(e){
	      var $pic = $(this)
	          ,pic_left = $pic.offset().left
	          ,pic_width = $pic.width()
	          ;
	      if(e.pageX>pic_left+pic_width/2){ //right cursor
	        if(!$pic.hasClass('cursor-right')){
	          $pic.removeClass('cursor-left').addClass('cursor-right')
	        }
	      }else{  //left cursor
	        if(!$pic.hasClass('cursor-left')){
	          $pic.removeClass('cursor-right').addClass('cursor-left')
	        }
	      } 
	    });
	    $('.ngg-galleryoverview .pic').on('click',function(){
	      var $pic = $(this);	      
	      if($pic.hasClass('cursor-left')){  //上一张图片
	      	if(cur_index>0){
	      		var id = '#ngg-thumbnail-'+(cur_index-1);
				location.href = $(id).attr('href');
	      	}	        
	      }else{  //下一张图片
	      	if(cur_index<(<?php echo count($images)?>-1)){
	      		var id = '#ngg-thumbnail-'+(cur_index+1);
	        	location.href = $(id).attr('href');	        	
	      	}else if($('#nextpost_link').length){
	      		var new_url = !!(typeof(yiqifa_url)=='undefined')?$('#nextpost_link').val():yiqifa_url;	      		
	      		location.href = new_url;
	      	}
	      }
	    });
	});
</script>